<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <meta http-equiv="Content-Language" content="zh-CN" />
        <meta content="all" name="robots" />
        <%= stylesheet_link_tag "/stylesheets/blue.css" %>
	    <%= stylesheet_link_tag "/stylesheets/images.css" %>
        <%= javascript_include_tag "/javascripts/ext/adapter/prototype/prototype.js" %>
        <%= javascript_include_tag "/javascripts/ext/adapter/prototype/scriptaculous.js" %>
        <%= javascript_include_tag "/javascripts/ext/adapter/prototype/effects.js" %>
        <%= javascript_include_tag "/javascripts/ext/adapter/prototype/ext-prototype-adapter.js" %>
        <%= javascript_include_tag "/javascripts/ext/ext-all-debug.js" %>
        <%= javascript_include_tag "/javascripts/ext/build/locale/ext-lang-zh_CN.js" %>
    </head>
    <body>
        <div id="tabs1">
            <div id="tabs" class="tab-content">
            </div>
            <div id="markup" class="tab-content">
                jkl; 
            </div>
        </div>
        <script>
            
            Ext.onReady(function(){
            
                var tabs = new Ext.TabPanel({
                    renderTo: 'tabs',
                    resizeTabs: true, // turn on tab resizing
                    minTabWidth: 115,
                    tabWidth: 135,
                    enableTabScroll: true,
                    width: 600,
                    height: 250,
                    defaults: {
                        autoScroll: true
                    }//,
                    //plugins: new Ext.ux.TabCloseMenu()
                });
                
                // tab generation code
                var index = 0;
                while (index < 7) {
                    addTab();
                }
                function addTab(){
                    tabs.add({
                        title: 'New Tab ' + (++index),
                        iconCls: 'tabs',
                        html: 'Tab Body ' + (index) + '<br/><br/>',// +
                        //Ext.example.bogusMarkup,
						
                        closable: true
                    }).show();
                }
                
                new Ext.Button({
                    text: 'Add Tab',
                    handler: addTab,
                    iconCls: 'new-tab'
                }).render(document.body, 'tabs');
            });
        </script>
    </body>
</html>
